<template>
	<view>
		<view class="uni-flex uni-row"  style="-webkit-flex-wrap: wrap;flex-wrap: wrap;margin: 12rpx;">
			<view class="bao" v-for="item in 8" :key="item">
				<view class="uni-flex uni-row top">
					<view class="liveStatus">llll</view>
					1234人
				</view>
				<image class="liveimg" src="../../static/images/live-girl.png"></image>
				<view class="uni-flex uni-row bottom">
					<view style="width: 200rpx;">
						<image src="../../static/images/live-head.png" style="width: 50rpx;height: 50rpx;"></image>
					</view>
					<view style="width: 180rpx;height: 50rpx;line-height: 50rpx;font-size: 35rpx;color: #FFFFFF;">
						<image src="../../static/images/live-like.png" style="width: 36rpx;height: 24rpx;margin-right: 20rpx;"></image>
						<text style="font-size: 26rpx;">20W</text>
					</view>
				</view>
			</view>
		</view>
		<!-- <uni-fab horizontal="right" vertical="bottom"></uni-fab> -->
	</view>
</template>

<script>
	import app from '@/common/evn/app.js'
	export default {
		components:{
			
		},
		data() {
			return {
				
			}
		},
		onLoad(option) {
			this.fun()
		},
		onReady() {
			/* this.fun.prototype.call = function () {
				console.log('哦我可以打电话');
			} */
		},
		onPullDownRefresh(){
			uni.stopPullDownRefresh()
		},
		onNavigationBarButtonTap(item) {
			
		},
		methods: {
			fun(){
				
			}
		}
	}
</script>

<style scoped>
	.liveimg{
		width: 342rpx;
		height: 458rpx;
	}
	.liveStatus{
		width: 70rpx;
		height: 44rpx;
		background-color: #003BE4;
		border-radius: 25rpx;
		text-align: center;
		line-height: 50rpx;
		color: #FFFFFF;
	}
	.bao{
		text-align: center;
		position: relative;
		width: 50%;
	}
	.top{
		position: absolute;
		margin: 16rpx;
		z-index: 9999;
		width: 170rpx;
		height: 44rpx;
		line-height: 50rpx;
		background-color: #FFFFFF;
		border-radius: 25rpx;
		opacity: 0.4;
		font-size: 24rpx;
		color: #333333;
		font-weight: bold;
		/* top: 20rpx;
		margin-left: 20rpx; */
	}
	.bottom{
		position: absolute;
		top: 200px;
		text-align: left;
		width: 342rpx;
		height: 50rpx;
		margin-bottom: 8rpx;
		margin-left: 28rpx;
	}
</style>
